﻿@{
    ViewBag.Title = "Index";
}
<div class="content">
    <div class="header">
        <h1 class="page-title">标题</h1>
    </div>
    <ul class="breadcrumb">
        <li><a href="index.html">汽车</a> <span class="divider">/</span></li>
        <li class="active">车辆管理</li>
    </ul>
    <div id="koContainer" class="container-fluid" data-page-size="10" data-url="/Autohome.Car/Car/list">
        <div class="row-fluid">

            <div class="btn-toolbar">
                <button id="btnAdd" class="btn btn-primary" data-target="#modal" data-template="Add" data-template-url="/Autohome.Car/Car/create" data-title="新增" data-toggle="modal"><i class="icon-plus"></i>新增</button>
                <button id="btnEdit" class="btn btn-primary" data-target="#modal" data-template="Edit" data-template-url="/Autohome.Car/Car/edit" data-title="修改" data-toggle="modal"><i class="icon-edit"></i>编辑</button>
                <button id="btnDelete" class="btn" data-confirm="确认删除吗？" data-url="/Autohome.Car/Car/Delete"><i class="icon-remove"></i>删除</button>
                <button id="btnImport" class="btn" data-target="#modal" data-template="Import" data-template-url="/Car/import" data-title="导入" data-toggle="modal">导入</button>
                <button id="btnExport" class="btn">导出</button>
                <div class="btn-group">
                </div>
            </div>
            <div class="well">
                <table class="table table-striped table-bordered">
                    <tr>
                        <th width="20px">
                            <input id="selAll" type="checkbox" /></th>
                        <th>车辆名称</th>
                        <th>车辆描述</th>
                        <th>价格</th>                      
                    </tr>
                    <tbody data-bind="foreach: Data">
                        <tr>
                            <td>
                                <input data-bind="value: Id" type="checkbox" /></td>

                            <td data-bind="text: Name"></td>
                            <td data-bind="text: Description"></td>
                            <td data-bind="text: Price"></td>                           
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="pagination pull-right">
                <ul>
                    <li data-bind="css: { disabled: Page.Number() <= 0 }"><a data-page="-1" href="#">«</a></li>
                    <!-- ko foreach: Page.List -->
                    <li data-bind="css: { active: $root.Page.Number() == $data }, visible: $root.Page.Show($data)"><a data-bind="    attr: { 'data-page': $data }, text: $data + 1" href="#"></a></li>
                    <!-- /ko -->
                    <li data-bind="css: { disabled: Page.Number() >= Page.MaxNumber() - 1 }"><a data-page="+1" href="#">»</a></li>
                </ul>
            </div>
            <script type="text/javascript">
    $(function () {
        $("#koContainer").amberme({
            init: function () {                
            }
        });

        $("#btnEdit").bind("click", function () {
            var id = $("#koContainer").data("amberme").viewModel.Selected.Item().Id();
            var editurl = "/Autohome.Car/Car/Edit?carId=" + id;
            $(this).data("template-url", editurl);
        });

        $("#btnExport").bind("click", function () {
            location.href = "/Car/export";
        });
    });
            </script>
            @Html.Partial("_Modal")


        </div>
    </div>
</div>
